<template>
  <view>
    <view class="box">
      <view class="pl15 pr15 menu_content_box_page" >
        
        <view class="mt15 area_block_1" v-for="item,index in carList" :key="index" v-if="carList.length > 0" >
          <view class="flex_box" @tap.stop="toEdit(item.id)">
            <view class="re mr25"><image:src="item.imgUrl" class="img17 vt"></image> iew>
            <view class="item">
              <view class="df fldc jcsb hp100">
                <view class="fs28 lh34 cor_333 ell">{{item.name}}</view>
                <view class="fs22 cor_808" style="widht: 200rpx;height: 22rpx;overflow: hidden;text-overflow:ellipsis; white-space: nowrap;">提交时间：{{item.createTime}}</view>
              </view>
            </view>
          </view>
          <imagev-if="item.state == 1" src="/static/icon_watermark_2.png" class="watermark_img_pos" @tap.stop="toEdit(item.id)"></image>   <i<imageif="item.state == 2" src="/static/icon_watermark_1.png" class="watermark_img_pos" @tap.stop="toEdit(item.id)"></image> 		  <view v-if="item.state == 3" class="view_report_btn" @tap.stop="report(item.reportId)">查看报告</view>
		</view>
		
		<view v-if="carList.length == 0" style="width: 100%;height: 100vh;">
				  <view style="height: 200rpx;"></view</image> age  src="../../static/excavator.png" style="width: 100%; padding: 100rpx 200rpx;"></image> 				  <view style="width: 100%;text-align: center;color: #808080;">暂无数据</view>
		</view>
		
      </view><!-- pl15 pr15 -->
	  
	 
      
      <!-- 上传设备图片-按钮 -->
      <view class="c</image> ately_btn" @tap="toAdd()">添加卖车咨询</view>
      
    </view><!-- box -->
  </view>
</template>

<script>
	import {
		toast,
		showLoading,
		hideLoading
	} from '@/utils/toast.js';
	import {
		getInfoListApi,
	} from '@/http/api.js';
  export default {
    data() {
      return {
		carList: [],
		pageIndex: 1,
		pageSize: 10,
		userId: uni.getStorageSync('userId')
      }
    },
	onLoad() {
		if (!uni.getStorageSync('userId')) {
			uni.reLaunch({
				url: '/pages/Sign_in/Sign_in'
			})
		}
		
		this.getInfoList();
	},
    methods: {
		toAdd() {
			uni.navigateTo({
				url: '/pages/information_collection/information_collection'
			})
		},
		
		getInfoList() {
			let that = this;
			showLoading('加载中');
			getInfoListApi({
				pageIndex: this.pageIndex,
				pageSize: this.pageSize,
				userId: this.userId
			}).then(res=>{
				that.carList = res.data.data;
				that.pageIndex = res.data.currentPage + 1;
				hideLoading();
			}).catch(err=>{
				toast(err.msg);
				hideLoading();
			})
		},
		
		report(reportId) {
			uni.navigateTo({
				url: '/pages/car_report/car_report_read?id=' + reportId
			})
		},
		
		toEdit(id) {
			uni.navigateTo({
				url: '/pages/information_collection_two/information_collection_two?id=' + id
			})
		}
    }
  }
</script>

<style>
  page { background-color: #f7f6f6;}
  .menu_content_box_page {
    position: relative;
    /* height: calc(100vh - 98rpx); */
    background-color: #f7f6f6;
    padding-bottom: 98rpx;
  }
  .area_block_1 {
    position: relative;
    padding: 32rpx 135rpx 30rpx 20rpx;
    background-color: #fff;
    border-radius: 20rpx;
  }
  .watermark_img_pos {
    position: absolute;
    right: 10rpx;
    bottom: 18rpx;
    width: 92rpx;
    height: 92rpx;
    z-index: 2;
  }
  .view_report_btn {
    position: absolute;
    top: 50%;
    right: 0;
    width: 120rpx;
    height: 48rpx;
    line-height: 48rpx;
    font-size: 22rpx;
    color: #fff;
    text-align: center;
    background-image: linear-gradient(90deg, #f46933, #e3140b);
    border-radius: 24rpx 0 0 24rpx;
    z-index: 2;
    transform: translateY(-50%);
  }
  .consult_immediately_btn {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    display: block;
    height: 98rpx;
    line-height: 98rpx;
    text-align: center;
    font-size: 34rpx;
    font-weight: bold;
    color: #fff;
    background: linear-gradient(90deg, #f44f33, #e10d09);
    z-index: 3;
  }
</style>
